[data-generate-account] {
  padding: 8px;
  background-color: white;
  box-shadow: 0 0 15px darkgrey;
  h1 {
    line-height: 2;
    font-size: 22pt;
    text-align: center;
    font-family: "黑体";
  }
  table {
    font-size: 12pt;
    width: 100%;
    font-family: simsun;
    tr {
      td,
      th {
        border: 1px solid black;
        line-height: 1;
        padding: 7px;
        vertical-align: middle;
      }
    }
    thead {
      th {
        font-weight: bold;
        background-color: lightgray;
        white-space: nowrap;
        &.th-method {
          width: 80px;
        }
        &.th-goods-name {
          //   background-color: red;
          min-width: 8em;
        }
        &.th-specs {
          //   background-color: red;
          // max-width: 2em;
          // width: 2em;
        }
        &.th-units {
          width: 2em;
          max-width: 3em;
          //   background-color: red;
        }
        &.th-change-count {
          //   background-color: red;
          width: 2em;
          max-width: 3em;
        }
        &.th-after-count {
          //   background-color: red;
          width: 2em;
          max-width: 3em;
        }
        &.th-depart {
          //   background-color: red;
        }
        &.th-requ {
          width: 6em;
          //   background-color: red;
        }
        &.th-empl {
          //   background-color: red;
          width: 6em;
        }
        &.th-time {
          &.time-column-short {
            // background-color: green;
            width: 9em;
          }
          &.time-column-long {
            // background-color: blue;
            width: 11em;
          }
        }
        &.th-goods-id {
          //   background-color: aqua;
          width: 11rem;
        }
      }
    }
    tbody {
    }
  }
}

// [data-window-area] {
//   margin-top: 15px;
//   .window {
//     border: 1px solid rgba(0, 0, 0, 0.7);
//     border-radius: 6px;
//     box-shadow: 2px 2px 10px 1px rgba(0, 0, 0, 0.7), inset 0 0 0 1px #fffa;
//     font: 9pt Segoe UI, SegoeUI, Noto Sans, sans-serif;
//     position: relative;
//     z-index: 0;
//   }
//   .window:before {
//     background: linear-gradient(transparent 20%, #ffffffb3 40%, transparent 41%),
//       linear-gradient(90deg, #ffffff66, #0000001a, #ffffff33), #4580c4;
//     border-radius: 6px;
//     box-shadow: inset 0 0 0 1px #fffd;
//     content: "";
//     height: 100%;
//     left: 0;
//     position: absolute;
//     top: 0;
//     width: 100%;
//     z-index: -1;
//   }
//   .window > .title-bar {
//     border: 0;
//     box-shadow: inset 0 1px 0 #fffd, inset 1px 0 0 #fffd, inset -1px 0 0 #fffd;
//   }
//   .title-bar {
//     align-items: center;
//     background: linear-gradient(90deg, #ffffff66, #0000001a, #ffffff33), #4580c4;
//     border: 1px solid rgba(0, 0, 0, 0.7);
//     border-radius: 6px 6px 0 0;
//     box-shadow: inset 0 0 0 1px #fff9;
//     display: flex;
//     font: 9pt Segoe UI, SegoeUI, Noto Sans, sans-serif;
//     justify-content: space-between;
//     padding: 6px;
//   }
//   .window-body.has-space {
//     padding: 6px;
//   }
//   .window-body {
//     background: #f0f0f0;
//     border: 1px solid rgba(0, 0, 0, 0.7);
//     box-shadow: 0 0 0 1px #fff9;
//     margin: 0 6px 6px;
//   }
//   .title-bar-text {
//     color: #000;
//     letter-spacing: 0;
//     line-height: 15px;
//     text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff,
//       0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff;
//   }
//   .title-bar.active .title-bar-controls,
//   .window.active .title-bar .title-bar-controls {
//     border-color: rgba(0, 0, 0, 0.7);
//   }
//   .title-bar-controls {
//     background: #fff3;
//     border: 1px solid rgba(0, 0, 0, 0.3);
//     border-radius: 0 0 5px 5px;
//     border-top: 0;
//     box-shadow: 0 1px 0 #fffa, 1px 0 0 #fffa, -1px 0 0 #fffa;
//     display: flex;
//     margin-top: -6px;
//   }
//   .title-bar {
//     align-items: center;
//     background: linear-gradient(90deg, #ffffff66, #0000001a, #ffffff33), #4580c4;
//     border: 1px solid rgba(0, 0, 0, 0.7);
//     border-radius: 6px 6px 0 0;
//     box-shadow: inset 0 0 0 1px #fff9;
//     display: flex;
//     font: 9pt Segoe UI, SegoeUI, Noto Sans, sans-serif;
//     justify-content: space-between;
//     padding: 6px;
//   }
//   .title-bar.active .title-bar-controls button.is-minimize,
//   .title-bar.active .title-bar-controls button[aria-label="Minimize"],
//   .window.active .title-bar .title-bar-controls button.is-minimize,
//   .window.active .title-bar .title-bar-controls button[aria-label="Minimize"] {
//     background: url()
//         no-repeat center 10px,
//       linear-gradient(
//         hsla(0, 0%, 100%, 0.5),
//         hsla(0, 0%, 100%, 0.3) 45%,
//         rgba(0, 0, 0, 0.1) 50%,
//         rgba(0, 0, 0, 0.1) 75%,
//         hsla(0, 0%, 100%, 0.5)
//       );
//   }
//   .title-bar.active .title-bar-controls button,
//   .window.active .title-bar .title-bar-controls button {
//     border-color: rgba(0, 0, 0, 0.7);
//     box-shadow: inset 0 0 0 1px #fffa;
//   }
//   .title-bar-controls button:first-child,
//   .title-bar-controls button:first-child:before {
//     border-bottom-left-radius: 5px;
//   }
//   [role="button"]:not(:disabled):not(:hover),
//   button:not(:disabled):not(:hover) {
//     border-color: #8e8f8f;
//     transition: border-color 1s linear;
//   }
//   .title-bar-controls button {
//     background: none;
//     border: 0;
//     border-radius: 0;
//     border-right: 1px solid rgba(0, 0, 0, 0.3);
//     box-shadow: none;
//     box-sizing: border-box;
//     min-height: 19px;
//     min-width: 29px;
//     padding: 0;
//     position: relative;
//   }
//   [role="button"],
//   button {
//     background: linear-gradient(180deg, #f2f2f2 45%, #ebebeb 0, #cfcfcf);
//     border: 1px solid #8e8f8f;
//     border-radius: 3px;
//     box-shadow: inset 0 0 0 1px #fffc;
//     box-sizing: border-box;
//     color: #222;
//     font: 9pt Segoe UI, SegoeUI, Noto Sans, sans-serif;
//     min-height: 23px;
//     min-width: 75px;
//     padding: 0 12px;
//     position: relative;
//     text-align: center;
//     z-index: 0;
//   }
//   .title-bar.active .title-bar-controls button.is-maximize,
//   .title-bar.active .title-bar-controls button[aria-label="Maximize"],
//   .window.active .title-bar .title-bar-controls button.is-maximize,
//   .window.active .title-bar .title-bar-controls button[aria-label="Maximize"] {
//     background: url()
//         no-repeat 50%,
//       linear-gradient(
//         hsla(0, 0%, 100%, 0.5),
//         hsla(0, 0%, 100%, 0.3) 45%,
//         rgba(0, 0, 0, 0.1) 50%,
//         rgba(0, 0, 0, 0.1) 75%,
//         hsla(0, 0%, 100%, 0.5)
//       );
//   }
//   .title-bar.active .title-bar-controls button.is-close,
//   .title-bar.active .title-bar-controls button[aria-label="Close"],
//   .window.active .title-bar .title-bar-controls button.is-close,
//   .window.active .title-bar .title-bar-controls button[aria-label="Close"] {
//     background: url()
//         no-repeat 50%,
//       linear-gradient(
//         hsla(0, 0%, 100%, 0.5),
//         hsla(0, 0%, 100%, 0.3) 45%,
//         rgba(0, 0, 0, 0.1) 50%,
//         rgba(0, 0, 0, 0.1) 75%,
//         hsla(0, 0%, 100%, 0.5)
//       ),
//       radial-gradient(circle at -60% 50%, #0007 5% 10%, #0000 50%),
//       radial-gradient(circle at 160% 50%, #0007 5% 10%, #0000 50%),
//       linear-gradient(#e0a197e5, #cf796a 25% 50%, #d54f36 50%);
//     box-shadow: inset 0 0 0 1px #fffa;
//   }
//   .title-bar.active .title-bar-controls button,
//   .window.active .title-bar .title-bar-controls button {
//     border-color: rgba(0, 0, 0, 0.7);
//     box-shadow: inset 0 0 0 1px #fffa;
//   }
//   .title-bar-controls button:last-child,
//   .title-bar-controls button:last-child:before {
//     border: 0;
//     border-bottom-right-radius: 5px;
//   }
//   .title-bar-controls button.is-close,
//   .title-bar-controls button[aria-label="Close"] {
//     min-width: 48px;
//   }
//   [role="button"]:not(:disabled):not(:hover),
//   button:not(:disabled):not(:hover) {
//     border-color: #8e8f8f;
//     transition: border-color 1s linear;
//   }
//   .title-bar-controls button:active,
//   .title-bar-controls button:hover {
//     background: none;
//   }
//   [role="button"]:not(:disabled):hover,
//   button:not(:disabled):hover {
//     border-color: #3c7fb1;
//     transition: border-color 0.3s;
//   }
//   .title-bar-controls button:active,
//   .title-bar-controls button:hover {
//     background: none;
//   }
//   [role="button"]:not(:disabled).active,
//   [role="button"]:not(:disabled):active,
//   button:not(:disabled).active,
//   button:not(:disabled):active {
//     border-color: #6d91ab;
//     transition: border-color 0.3s;
//   }
//   .title-bar-controls button:active,
//   .title-bar-controls button:hover {
//     background: none;
//   }
//   [role="button"]:not(:disabled).active,
//   [role="button"]:not(:disabled):active,
//   button:not(:disabled).active,
//   button:not(:disabled):active {
//     border-color: #6d91ab;
//     transition: border-color 0.3s;
//   }
//   [role="button"]:not(:disabled):not(:hover),
//   button:not(:disabled):not(:hover) {
//     border-color: #8e8f8f;
//     transition: border-color 1s linear;
//   }
// }
